@using Page = viBook.Models.Page
@model Page
@{
    ViewBag.Title = "Edit Page Detail";
}
<script src="../../Content/tapmodo-Jcrop-5e58bc9/js/jquery.Jcrop.min.js" type="text/javascript"> </script>
<link href="../../Content/tapmodo-Jcrop-5e58bc9/css/jquery.Jcrop.css" rel="stylesheet"
    type="text/css" />
<link href="../../Content/Tag.css" rel="stylesheet" type="text/css" />
<link href="../../Content/Custom.css" rel="stylesheet" type="text/css" />
<script src="../../Content/jquery.fancybox-1.3.4/jquery.fancybox-1.3.4.js" type="text/javascript"> </script>
<link href="../../Content/jquery.fancybox-1.3.4/jquery.fancybox-1.3.4.css" rel="stylesheet"
    type="text/css" />
<div class="container">
    <div class="span-24" id="book-wrapper">
        <div id="screenshot-title-section" class="full title span-24">
            <div class="single-title vcard group">
                <a href="/bpotstra" class="url" rel="contact" title="Brian Potstra">
                    <img alt="Bp" class="photo fn" src="http://dribbble.s3.amazonaws.com/users/770/avatars/original/bp.jpg?1305129390">
                </a>
                <h1 id="screenshot-title">
                    Presets one &amp; two</h1>
                <div class="shot-byline">
                    <span class="shot-byline-user">by <a href="/bpotstra" class="url" rel="contact">Brian
                        Potstra</a> </span>
                    <div class="follow-prompt">
                        <form action="/bpotstra/followers/NhimConLonTon" method="post">
                        <div style="margin: 0; padding: 0; display: inline">
                            <input name="_method" type="hidden" value="delete">
                            <input name="authenticity_token" type="hidden" value="BEjADsUgu+M8oFw04wCyTSgZDOw3LHFk1iEgzFW5tGI=">
                        </div>
                        <a href="#" class="action following" title="You are following Brian Potstra. Click to unfollow.">
                            <span>Following</span> </a>
                        </form>
                    </div>
                    <span class="screenshot-dash"><span class="sep">|</span> June 23, 2011 </span>
                    <div class="screenshot-dash">
                    </div>
                </div>
            </div>
        </div>
        <br />
        <input id="button-init-tag" type="button" data-bind="click: createNewTag" value="Tag picture" />
        <input id="button-destroy-tag" style="display: none" type="button" data-bind="click: cancelTag"
            value="Cancel" />
        <a id="button-save-tag" href="#add-tag-modal" style="display: none" type="button"
            data-bind="click: saveTag">Save</a>
        <input id="button-save-all" type="button" data-bind="click: saveAll" value="Save all edited tags" />
        <div id="add-tag-modal" style="display: none">
            <textarea id='converted-text' cols="9" rows="3" style="width: 300px">This is your converted text</textarea>
            <textarea id='translated-text' cols="9" rows="3" style="width: 300px">This is your translated text</textarea>
            <a id="button-finish-save-tag" data-bind="click: finishSaveTag" href="#">Save</a>
            <a id="button-cancel-save-tag" data-bind="click: cancelSaveTag" href="#">Cancel</a>
        </div>
    </div>
    <div data-bind="template: {name:'TagTemplate', foreach: tagCollection}">
    </div>
    <div data-bind="template:{name:'ChapterTemplate',foreach:picture}">
    </div>
</div>
@Html.Partial("EditJS")
